import React, { useState } from "react";
import "./Index.css";
import { Button, Form, Input } from "antd-mobile";
import { NavBar } from "antd-mobile";
import { useNavigate } from "react-router-dom";
// import { EyeInvisibleOutline, EyeOutline } from "antd-mobile-icons";

function Index() {
  // const [visible, setVisible] = useState(false);
  const nav=useNavigate()
  return (
    <div className="reg">
      <NavBar style={{ color: "white" }}>忘记密码</NavBar>
      <div className="biao"></div>

      <div className="frrm">
        <Form className="fn">
          <Form.Item
            extra={
              <Button block size="small" shape="rounded" color="primary">
                获取验证码
              </Button>
            }
          >
            <Input placeholder="请输入邮箱" />
          </Form.Item>

          <Form.Item>
            <Input placeholder="请输入验证码" />
          </Form.Item>
        </Form>
      </div>

      <div className="btn">
        <Button
          block
          type="submit"
          color="primary"
          style={{ background: "white", color: "blue" }}
          onClick={()=>nav('/setxin')}
        >
          下一步
        </Button>
      </div>
    </div>
  );
}

export default Index;
